<template>
    {{ d.num.toFixed(0) }}
</template>

<script setup>
import { reactive,watch } from 'vue'
import gsap from 'gsap'

// 数字动画效果组件
const props = defineProps({
    value:{
        type:Number,
        default:0
    }
})

const d =reactive({
    num:0
})

// 动画效果函数
function AnimateToValue(){
    gsap.to(d, {
        duration:0.5,
        num:props.value
    })
}

AnimateToValue()

watch(()=>props.value,()=>AnimateToValue())
</script>